<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css"/>
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin"/>
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css"/>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="static/vant/index.css">
    <link rel="stylesheet" href="static/element/index.css">

    <title>Title</title>
    <style>
        .el-select .el-input .el-select__caret::before {
            /*content: "\e78f"*/
            content: "";
            background: url(static/img/Check.ico) center center no-repeat;
            position: absolute;
            width: 50%;
            height: 50%;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button {
            -webkit-appearance: none;
        }

        input[type='number'] {
            -moz-appearance: textfield;
        }
    </style>
</head>
<body>
<article class="page-container" id="app">
    <table style="table-layout:fixed; width: 100%; word-break:break-all;" class="table table-border table-bordered table-bg table-hover table-sort table-responsive">
        <tbody id="datalist">
        <tr class="text-c">
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">人员帐号</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" v-model="ryzh" autocomplete="off" readonly="readonly">
            </td>
            <td style="width: 100px; font-weight: bolder; font-size: 0.8rem; background: #eee;">人员姓名</td>
            <td style="font-size: 0.8rem;">
                <input type="text" class="input-text" style="border:0;" v-model="ryxm" autocomplete="off" readonly="readonly">
            </td>
        </tr>
        </tbody>
    </table>

    <div style="overflow-x: auto; overflow-y: auto; height: 480px; width:100%; margin-top: 10px;">
        <table style="table-layout:fixed; width: 100%;  word-break:break-all;" class="table table-border table-bordered table-bg table-hover table-sort table-responsive">
            <tbody>
            <tr class='text-c' v-for="item in tableAllbm" :key="item.VALUE01" v-cloak>
                <td style='text-align: left; padding-left: 20px'>
                    <label class='' style='font-size:18px'><input type='checkbox' :value='item.VALUE01' style="margin-right: 20px" v-model='checkAllbm' name='user-Character-0-0'>{{item.VALUE02}}</label>
                </td>
            </tr>
            </tbody>
        </table>
    </div>

    <van-row style="margin-top: 25px;">
        <van-col span="6"></van-col>
        <van-col span="6"></van-col>
        <van-col span="6">
            <div style="text-align: right">
                <van-button type="primary" @click="fDo()" style="width: 80%">保存</van-button>
            </div>
        </van-col>
        <van-col span="6">
            <div style="text-align: right">
                <van-button type="info" @click="fExit()" style="width: 80%">返回</van-button>
            </div>
        </van-col>
    </van-row>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="static/axios.min.js"></script>
<script type="text/javascript" src="static/vue/vue.min.js"></script>
<script type="text/javascript" src="static/vant/vant.min.js"></script>
<script type="text/javascript" src="static/element/index.js"></script>
<script type="text/javascript">
    let vm = new Vue({
        el: '#app',
        data: {
            ryzh: '',
            ryxm: '',
            tableAllbm: [],
            checkAllbm: []
        },
        methods: {
            fDo() {
                let params = new URLSearchParams();
                params.append('CMD', "AI");
                params.append('VALUE01', this.ryzh);
                params.append('VALUE02', this.checkAllbm.toString());
                axios.post('/f_wscl/com2', params)
                    .then(function (res) {
                        let {db1} = res.data
                        if (db1[0].VALUE01 === 'ZZ01') {
                            layer.msg(db1[0].VALUE02, {icon: 0, time: 2000});
                        } else if (db1[0].VALUE01 === 'ZZ00') {
                            layer.msg('管理范围保存操作完毕!', {icon: 1, time: 1500}, function () {
                                let index = parent.layer.getFrameIndex(window.name);
                                parent.fInit();
                                parent.layer.close(index);
                            });
                        }
                    })
                    .catch(function (error) {
                        layer.msg('网络异常错误', {icon: 1, time: 1000});
                    });
            },

            fInit(o) {
                this.ryzh = o.ryzh
                this.ryxm = o.ryxm

                this.tableAllbm = o.tableAllbm
                for (let i = 0; i < o.checkAllbm.length; i++) {
                    this.checkAllbm.push(o.checkAllbm[i].VALUE01)
                }
            },

            fExit() {
                let index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            }
        },

        created() {
            window.fInit = this.fInit
        }
    })

    $(document).ajaxComplete(function (event, xhr, settings) {
        //从http头信息取出 在filter定义的sessionstatus，判断是否是 timeout
        if (xhr.getResponseHeader("sessionstatus") === "timeout") {
            //从http头信息取出登录的url ＝ loginPath
            if (xhr.getResponseHeader("loginPath")) {
                window.location.replace(xhr.getResponseHeader("loginPath"));
            }
        }
    });
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
